<div class="body-panel" style="min-height: 680px" ng-controller="ordersDeatilsController">
    <div style="width: 95%; margin: auto;">
        <h2>
            Orders List <small>You can know your orders details here.</small>
        </h2>
    </div>
    <br />
    <div
            style="position: relative; width: 95%; border: 1px solid #ddd; margin: auto;">
        <table class="table table-striped text-center table-hover">
            <thead>
            <tr>
                <td>Dish Name</td>
                <td>Img</td>
                <td>Price</td>
                <td>Count</td>
                <td>Total</td>
            </tr>
            </thead>
            <tbody>


                <tr ng-repeat="o in orderItem">
                    <td width="20%" style="vertical-align: middle">{{o.dish.dname}}</td>
                    <td width="20%" style="vertical-align: middle">
                        <img style="width: 40px; height: 40px; border-radius: 20px;" ng-src="{{constant.imgServer}}{{o.dish.img}}">
                    </td>
                    <td width="20%" style="vertical-align: middle">{{o.dish.price}}</td>
                    <td width="20%" style="vertical-align: middle">{{o.num}}</td>
                    <td width="20%" style="vertical-align: middle">¥{{o.num * o.dish.price}}</td>
                </tr>


            </tbody>
        </table>
    </div>

</div>